<template>
  <a-spin :spinning="loading">
    <div style="display: flex;">
      <a-upload
          name="file"
          :action="action"
          :headers="headers"
          :show-upload-list="false"
          @change="handleChange"
      >
        <a-button type="primary" :loading="loading">
          <uploadOutlined/>
          上传
        </a-button>
      </a-upload>
      <a-button style="margin-left: 5px;" type="primary" @click="handleControl('clear')">批量清除</a-button>
      <a-button style="margin-left: 5px;" type="primary" :loading="handleLoading" @click="handleControl('control')">批量调整</a-button>
    </div>
    <common-table
        :columns="columns"
        :dataSource="dataLists"
        :scroll="{ x: 'max-content'}"
        :slots="['action','status','skus']"
    >
      <template #action="{ record }">
          <a-button type="primary" v-if="record.resolveFlag === 'N'" @click="handleOne(record,'clear')">清除</a-button>
          <a-button type="primary" :loading="record.loading" v-else @click="handleOne(record,'control')">调整</a-button>
      </template>
      <template #status="{ record }">
        <span>{{ record.status?.code }} - {{record.status?.name}}</span>
      </template>
      <template #skus="{ record }">
        <div v-if="record.skus && record.skus.length > 0" v-for="(item, index) in record.skus" :key="index">
          {{ item.sku + ' *' + item.qty}}
        </div>
      </template>
    </common-table>
  </a-spin>
</template>
<script>
export default {
  name:'inventoryPools-uploadAndAnalysis'
}
</script>
<script setup>
import { ref } from "vue";
import CommonTable from "@/components/commonTable/index.vue";
import {getToken} from "@utils/storage.js";
import {adjust} from "@/api/inventoryPools/uploadAndAnalysis.js";
import {message} from "ant-design-vue";
const columns = [
  {
    title: '仓库编码',
    dataIndex: 'warehouseCode',
    key: 'warehouseCode',
    width: 150,
    align: 'center',
  },
  {
    title: '仓库邮编',
    dataIndex: 'zipCode',
    key: 'zipCode',
    width: 150,
    align: 'center',
  },
  {
    title: '平台订单',
    dataIndex: 'orderId',
    key: 'orderId',
    width: 150,
    align: 'center',
  },
  {
    title: '易仓订单',
    dataIndex: 'saleOrderCode',
    key: 'saleOrderCode',
    width: 150,
    align: 'center',
  },
  {
    title: '易仓状态',
    dataIndex: 'status',
    key: 'status',
    width: 150,
    align: 'center',
    scopedSlots: { customRender: 'status' },
  },
  {
    title: 'SKU',
    dataIndex: 'skus',
    key: 'skus',
    width: 150,
    align: 'center',
    scopedSlots: { customRender: 'skus' },
  },
  {
    title: '当前仓库',
    dataIndex: 'curWarehouseCode',
    key: 'curWarehouseCode',
    width: 150,
    align: 'center',
  },
  {
    title: '处理结果',
    dataIndex: 'result',
    key: 'result',
    width: 150,
    align: 'center',
  },
  {
    title: '操作',
    dataIndex: 'action',
    key: 'action',
    align: 'center',
    width: 150,
  },
]
const action = import.meta.env.VITE_API_BASE_URL + '/wayfair/analyseWayFairTable'
const loading = ref(false)
const dataLists = ref([])
const headers = {
  'X-Access-Token':getToken()
}
const handleLoading = ref(false)
/**
 * 上传文件
 * @param file 文件对象
 */
const handleChange = (file) => {
  loading.value = true
  console.log(file)
  if(file.file.status === 'done'){
    console.log(file)
    dataLists.value = file.file.response.result.records
    dataLists.value.forEach(item => {
      item.loading = false
    })
    loading.value = false
  }
}
/**
 * 处理单个
 * @param record 单个数据
 * @param type 处理类型
 */
const handleOne = async (record,type) => {
  if(type === 'clear'){
    console.log(record)
    dataLists.value = dataLists.value.filter(item => item.orderId !== record.orderId)
  }else{
   try{
     record.loading = true
     const res = await adjust({
       saleOrderCode: record.saleOrderCode,
       warehouseCode: record.warehouseCode,
       skus: record.skus.map((items) => {
         return items.sku
       })
     })
     record.result = res.result.result
     record.resolveFlag = res.resolveFlag
     record.loading = false
     record.skus = res.skus
     record.curWarehouseCode = res.curWarehouseCode
     console.log(res)
     console.log(record)
   }catch (e){
     message.error(e)
   }finally {
     record.loading = false
   }
  }
}

/**
 * 批量处理
 * @param type 处理类型
 */
const handleControl = (type) => {
  if(type === 'clear'){
    dataLists.value = dataLists.value.filter(item => item.resolveFlag === 'Y')
  }else{
      dataLists.value.forEach(async item => {
          if(item.resolveFlag === 'Y'){
            item.loading = true
            try{
              const res = await adjust({
                saleOrderCode: item.saleOrderCode,
                warehouseCode: item.warehouseCode,
                skus: item.skus.map((items) => {
                  return items.sku
                })
              })
              item.result = res.result.result
              item.resolveFlag = res.resolveFlag
              item.skus = res.skus
              item.curWarehouseCode = res.curWarehouseCode
            }catch (e){
              message.error(e)
            }finally {
              item.loading = false
            }
          }
      })
  }
}
</script>

<style scoped>

</style>
